<template>
    <div class="permission">
           <el-tabs  class="el-tabs"  v-model="activeName"  type="card">
              <el-tab-pane
                label="管理员列表"
                name="1"
              >
              </el-tab-pane>
                <el-tab-pane
                label="管理员日志"
                name="2"
              >
              </el-tab-pane> 
                    <el-tab-pane
                label="角色列表"
                name="3"
              >
              </el-tab-pane> 
           </el-tabs>
           <div  class="admini-list" v-if='activeName==1'>
              <adminlist></adminlist>
           </div>
           <div v-if='activeName==2'>
             <rizhi></rizhi>
           </div>
           <div v-if='activeName==3'>
             <juese></juese>
           </div>
       
    </div>
</template>
<script>
//管理员列表
import addmin from "./componens/addadmin"
// 日志
import  rizhi from "./componens/rizhi"
import  rizhiinfo from "./componens/rizhiinfo"
import adminlist from "./componens/adminlist"
import juese from "./componens/juese"
export default {
    name:'permisson',
    data(){
        return {
            activeName:'1',
            tableData:[]
        }
    },
    components:{
        adminlist,
        addmin,
        rizhi,
        rizhiinfo,
        juese
    },
    computed:{
    },
    methods:{
        //添加管理员
        addadmin(){
            this.showadmin =true
        }
    },
    created(){
      // console.log(this.userInfo);
    }
}
</script>
<style lang="less" scoped>
/deep/ .el-tabs__item.is-active {
    border-top: 3px solid #009380;
    border-right: 1px solid #009380;
    border-left: 1px solid #009380;
    border-bottom: 1px solid #FFFFFF!important;
    color: #333333;
}
/deep/ .el-tabs__header {
       border-bottom: 1px solid #CCEAE6!important
}
/deep/ .el-tabs__nav-wrap {
    overflow: hidden;
    margin-bottom: -4px;
    position: relative;
}
/deep/ .el-tabs__item  {
    &:hover {
        color: #333333;
    }

}
.admini-list {
    padding-left: 16px;
    .btn {
        width: 77px;
        font-size: 10px;
        padding: auto!important;

    }
    .el-button {
        padding: 12px 9px;
    }
}
.permission {
    background-color: #FFFFFF;
    height: 100%;
}
 /deep/ .el-dialog__header {
   background-color: #009380!important;
   .el-dialog__title { 
     color: aliceblue!important;
   }
}


</style>